<nz-card>
    <div nz-row class="mb-md">
        <div nz-col [nzSpan]="6">
            <nz-input-group nzSearch [nzAddOnAfter]="suffixButton">
                <input nz-input name="value" [(ngModel)]="search.text" nzSize="default"
                    [placeholder]="'请输入数据代码、值或描述'" />
            </nz-input-group>
            <ng-template #suffixButton>
                <button nz-button nzType="primary" (click)="getDataDictionarys()" [nzLoading]="tableLoading" nzSearch>
                    查询
                </button>
            </ng-template>
        </div>
        <div nz-col [nzSpan]="6"></div>
        <div nz-col [nzSpan]="12" class="mb-md" style="text-align: right">
            <button nz-button (click)="create()" nzType="primary">
                <i nz-icon nzType="plus"></i>
                <span>新增</span>
            </button>
        </div>
    </div>
    <nz-table [nzData]="query.dataList" [nzFrontPagination]="false" [nzLoading]="tableLoading"
        [nzShowPagination]="false">
        <thead nz-thead>
            <tr>
                <!-- <th nz-th>
                    <span>组名</span>
                </th> -->
                <th nz-th>
                    <span>序号</span>
                </th>
                <th *ngIf="group && group.mode != 3" nz-th>
                    <span>名称</span>
                </th>
                <th nz-th>
                    <span>代码</span>
                </th>
                <th nz-th *ngIf="group && group.mode == 3">
                    <span>配置值</span>
                </th>
                <th *ngIf="group && group.mode == 3" nz-th>
                    <span>配置说明</span>
                </th>
                <th nz-th>
                    <span>创建时间</span>
                </th>
                <th>
                    <span>操作</span>
                </th>
            </tr>
        </thead>
        <tbody nz-tbody *ngIf="group && group.mode != 2">
            <tr nz-tbody-tr *ngFor="let ding of query.dataList">
                <!-- <td nz-td>{{ ding.groupName }}</td> -->
                <td nz-td>{{ ding.seq }}</td>
                <td *ngIf="group && group.mode != 3" nz-td>{{ ding.desc }}</td>
                <td nz-td>{{ ding.code }}</td>
                <td nz-td *ngIf="group.mode == 3">{{ ding.value }}</td>
                <td *ngIf="group && group.mode == 3" nz-td>{{ ding.desc }}</td>
                <td nz-td>{{ ding.creationTime | date:'yyyy-MM-dd HH:mm' }}</td>
                <td nz-td>
                    <a (click)="editDing(ding)">编辑</a>
                    <span nz-table-divider></span>
                    <nz-divider nzType="vertical"></nz-divider>
                    <a style="color:#ff4d4f;" (click)="delete(ding)">删除</a>
                </td>
            </tr>
        </tbody>
        <tbody nz-tbody *ngIf="group && group.mode == 2">
            <ng-template ngFor let-data [ngForOf]="query.dataList">
                <ng-template ngFor let-item [ngForOf]="expandDataCache[data.id]">
                    <tr *ngIf="(item.parent&&item.parent.expand)||!(item.parent)">
                        <td nz-td>{{ item.seq }}</td>
                        <td nz-td [nzIndentSize]="item.level*20" [nzShowExpand]="!!item.children"
                            [(nzExpand)]="item.expand"
                            (nzExpandChange)="collapse(expandDataCache[data.id],item,$event)">
                            {{item.desc}}
                        </td>
                        <td nz-td *ngIf="group.mode == 3">{{ item.value }}</td>
                        <td nz-td>{{ item.code }}</td>
                        <td nz-td>{{ item.creationTime | date:'yyyy-MM-dd HH:mm' }}</td>
                        <td nz-td>
                            <a (click)="editDing(item)">编辑</a>
                            <span nz-table-divider></span>
                            <nz-divider nzType="vertical"></nz-divider>
                            <a (click)="addSubset(item)">添加子项</a>
                            <span nz-table-divider></span>
                            <nz-divider nzType="vertical"></nz-divider>
                            <a style="color:#ff4d4f;" (click)="delete(item)">删除</a>
                            <span nz-table-divider></span>
                            <nz-divider nzType="vertical"></nz-divider>
                            <a nz-dropdown class="operation" [nzDropdownMenu]="menu"> 更多 <i nz-icon nzType="down"></i>
                            </a>
                            <nz-dropdown-menu #menu="nzDropdownMenu">
                                <ul nz-menu>
                                    <li nz-menu-item>
                                        <a (click)="upgrade(item)">升级</a>
                                    </li>
                                    <li nz-menu-item>
                                        <a (click)="downgrade(item)">降级</a>
                                    </li>
                                    <li nz-menu-item>
                                        <a (click)="transfer(item)">转移</a>
                                    </li>
                                </ul>
                            </nz-dropdown-menu>
                        </td>
                    </tr>
                </ng-template>
            </ng-template>
        </tbody>
    </nz-table>
</nz-card>
<nz-modal *ngIf="transferItem" [(nzVisible)]="isVisible" nzTitle="转移节点" (nzOnCancel)="handleCancel()"
    [nzFooter]="modalFooter">
    <div nz-row>
        <div nz-col>节点&nbsp;&nbsp;<nz-tag [nzColor]="'blue'">{{transferItem.desc}}</nz-tag>转移到节点&nbsp;&nbsp;
            <data-tree-select [(groupCode)]="group.code" [width]="'180px'" [(ngModel)]="transferCode" #dataTree>
            </data-tree-select>
            &nbsp;&nbsp;下面</div>
    </div>
    <ng-template #modalFooter>
        <button nz-button nzType="default" (click)="handleCancel()">取消</button>
        <button nz-button nzType="primary" (click)="handleOk()" [nzLoading]="isTransferLoading">转移</button>
    </ng-template>
</nz-modal>